﻿<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <title>新用户注册</title>
    <meta charset="utf-8">
    <meta name="description" content="">
    <meta name="author" content="">
    <link href="/static/css/green.css" rel="stylesheet">
    <!--[if lt IE 9]>
    <script src="/static/js/html5shiv.js"></script>
    <script src="/static/js/respond.min.js"></script>
    <![endif]-->
</head>
<body>
    <div class="container">
        <div id="registerBox">
            <h1>用户注册</h1>
            <div class="box1" id="usernameBox">
                <div class="box2">
                    <label class="label1">用户名</label>
                </div>
                <div class="box3">
                    <input type="text" class="input1" id="username" placeholder="用户名" />
                </div>
                <div class="box4"></div>
                <div class="box5"><p>请输入长度大于2的字符(数字/英文字母/符号/汉字)</p></div>
            </div>

            <div class="box1" id="goodnameBox">
                <div class="box2"><label class="label1">昵称</label></div>
                <div class="box3"><input type="text" class="input1" id="goodname" placeholder="昵称" /></div>
                <div class="box4"></div>
                <div class="box5"><p>请输入长度大于2的字符(数字/英文字母/符号/汉字)</p></div>
            </div>

            <div class="box1" id="emailBox">
                <div class="box2"><label class="label1">Email</label></div>
                <div class="box3"><input type="text" class="input1" id="email" placeholder="Email" /></div>
                <div class="box4"></div>
                <div class="box5"><p>请输入正确的Email地址</p></div>
            </div>

            <div class="box1" id="passwordBox">
                <div class="box2"><label class="label1">密码</label></div>
                <div class="box3"><input type="password" class="input1" id="password" placeholder="密码" /></div>
                <div class="box4"></div>
                <div class="box5"><p>请输入长度大于6的字符(数字/英文字母/符号)</p></div>
            </div>

            <div class="box1" id="passwordAgainBox">
                <div class="box2"><label class="label1">再次输入密码</label></div>
                <div class="box3"><input type="password" class="input1" id="againpassword" placeholder="再次输入密码" /></div>
                <div class="box4"></div>
                <div class="box5"><p>请再次输入上面的秘密</p></div>
            </div>

            <div class="box1">
                <div class="box2"></div>
                <div class="box3"><button type="button" class="button1" id="register">注册</button></div>
                <div class="box4"></div>
                <div class="box5"></div>
            </div>
        </div>

    </div>
    <script src="/static/js/jquery-1.9.0.min.js"></script>
    <script src="/static/js/jquery.md5.js"></script>
    <script src="/static/js/json2.js"></script>
    <script>
        $(document).ready(function() {
            
            $("#register").click(function() {
                var username = $("#username").val();
                var password = $("#password").val();
                var newUser = {
                    Username: $.md5(username),
                    Goodname: $("#goodname").val(),
                    Email: $("#email").val(),
                    Password: $.md5(password)
                }
                var jsonList = JSON.stringify(newUser);

                $("label").remove(".errlabel");

                if ($("#password").val() != $("#againpassword").val()) {
                    $("#passwordAgainBox").append("<label class=\"errlabel control-label\"><b class=\"text-danger pull-left\">两次输入的秘密不一样</b></label>");
                }

                if (username.length < 3) {
                    $("#usernameBox").append("<label class=\"errlabel control-label\"><b class=\"text-danger pull-left\">请输入长度大于3的字符串</b></label>");
                } else if (password.length < 6) {
                    $("#passwordBox").append("<label class=\"errlabel control-label\"><b class=\"text-danger pull-left\">请输入长度大于6的字符串</b></label>");
                } else {

                    $.ajax({
                        type: "post",
                        contentType: "application/json; charset=utf-8",
                        dataType: "json",
                        url: "/green/user/create",
                        data: jsonList,
                        //async : false,
                        success: function(data) {
                            $.each(data, function(k, v) {
                                if (v.Key == "logout") {
                                    alert("请先退出登录！");
                                    location.href="/static/html/logout.html";
                                } else if (v.Key == "registerSuccess") {
                                    location.href="/green";
                                    //alert("跳转到首页！");
                                } else if (v.Key == "usernameMin" || v.Key == "usernameMax" || v.Key == "usernameAgain") {
                                    $("#usernameBox").append("<label class=\"errlabel control-label\"><b class=\"text-danger pull-left\">" + v.Message + "</b></label>");
                                } else if (v.Key == "goodnameMin" || v.Key == "goodnameMax" || v.Key == "goodnameAgain") {
                                    $("#goodnameBox").append("<label class=\"errlabel control-label\"><b class=\"text-danger pull-left\">" + v.Message + "</b></label>");
                                } else if (v.Key == "emailerr") {
                                    $("#emailBox").append("<label class=\"errlabel control-label\"><b class=\"text-danger pull-left\">" + v.Message + "</b></label>");
                                } else if (v.Key == "passwordMin" || v.Key == "passwordMax") {
                                    $("#passwordBox").append("<label class=\"errlabel control-label\"><b class=\"text-danger pull-left\">" + v.Message + "</b></label>");
                                }
                            });
                        }
                    });
                }
            });
        });
</script>
</body>
</html>